<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<!-- 适配移动端 -->
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1, user-scalable=no, shrink-to-fit=no, minimal-ui">
		<title>Health</title>
		<!-- 引入fontawesome5css -->
		<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/all.css" integrity="sha384-B4dIYHKNBt8Bc12p+WXckhzcICo0wtJAoU8YZTY5qE0Id1GSseTk6S+L3BlXeVIU" crossorigin="anonymous">
		<!-- 引入自己的css -->
		<link rel="stylesheet" type="text/css" href="__PUBLIC__/Home/css/index.css" />
	</head>

	<body class="body-color">
		<!-- 页头 -->
		<div id="food-header">
			<div class="f-header-title">
				<a href="javascript:history.back(-1);">
					<i class="fas fa-arrow-left"></i>
				</a>
				<h5>
					<switch name="meals" >
						<case value="1">早餐</case>
						<case value="2">午餐</case>
						<case value="3">晚餐</case>
						<case value="4">早点</case>
						<case value="5">下午茶</case>
						<case value="6">夜宵</case>
					</switch>
				</h5>
				<a id="submit" href="{:U('Index/index')}">完成</a>
			</div>
		</div>
		
		<!-- 主题 -->
		<div id="complete-main">
			<div class="img">
				<a href="javascript:;">
					<i class="far fa-image"></i>
				</a>
			</div>
			
			<div class="num">
				<h2>总卡路里：&nbsp;&nbsp;&nbsp;{$calnum}大卡</h2>
				<p>碳水化合物&nbsp;{$carnum}&nbsp;g.&nbsp;脂肪&nbsp;{$fatnum}&nbsp;g.&nbsp;蛋白质&nbsp;{$pronum}&nbsp;g</p>
				<a id="submit2" href="{:U('Index/diet')}">添加至我的食物</a>
				<input type="hidden" id="meals" value="{$meals}" />
				<input type="hidden" id="calnum" value="{$calnum}" />
				<input type="hidden" id="carnum" value="{$carnum}" />
				<input type="hidden" id="fatnum" value="{$fatnum}" />
				<input type="hidden" id="pronum" value="{$pronum}" />
				<input type="hidden" id="time" value="<?php echo time(); ?>" />
			</div>
			
			<div class="time">
				<p>时间</p>
				<a href="javascript:;"><php>echo date("H:i")</php></a>
			</div>
			<volist name="data" id="row">
				<div class="food">
					<div class="title">
						<p>{$row.name}</p>
						<span>{$row.calories}&nbsp;大卡.&nbsp;{$row.carbohydrates}&nbsp;碳水化合物.&nbsp;{$row.fat}&nbsp;脂肪.&nbsp;{$row.protein}&nbsp;蛋白质</span>
					</div>
					
					<div class="btn">
						<a href="{:U('Index/addquantity',array('id'=>$row['id']))}"><i class="fas fa-plus"></i></a>
						<input type="text" fid="{$row.id}" oninput="value=value.replace(/[^\d]/g,'')" value="{$row.quantity}" />
						<a href="{:U('Index/subquantity',array('id'=>$row['id']))}"><i class="fas fa-minus"></i></a>
					</div>
				</div>
			</volist>
			<div class="add-food">
				<a href="{:U('Index/food',array('meals_id'=>$meals))}">添加食物</a>
			</div>
		</div>
		
		<!-- 引入jQuery3js -->
		<script src="__PUBLIC__/js/jquery-3.3.1.min.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			$(function () {
				$(".btn input").bind('input propertychange', function() {
					var fid = $(this).attr("fid");
					var quantity = $(this).val();
					$.post("{:U('Index/ajax_quantity')}", {
						fid: fid,
				        quantity: quantity,
				   	}, function(data) {
//					    console.log(data);
			       		$(this).val(data);
				    }, "json");
				});
				
				$("#submit, #submit2").click(function () {
					var meals = $("#meals").val();
					var calnum = $("#calnum").val();
					var carnum = $("#carnum").val();
					var fatnum = $("#fatnum").val();
					var pronum = $("#pronum").val();
					var time = $("#time").val();
					
					$.post("{:U('Index/ajax_submit')}", {
						meals_id:meals,
						calnum: calnum,
				        carnum: carnum,
				        fatnum: fatnum,
				        pronum: pronum,
				        time: time,
				   }, function(data) {
				    }, "json");
				});
			})
		</script>
	</body>

</html>